import React from "react";
import { NavLink } from "react-router-dom";
import "./tabbar.less";

const list = [
  {
    title: "电影/影院",
    url: "movies",
    icon: <span className="iconfont icon-dianying"></span>,
  },
  {
    title: "视频",
    url: "video",
    icon: <span className="iconfont icon-shipin"></span>,
  },
  {
    title: "小视频",
    url: "mini",
    icon: <span className="iconfont icon-xiaoshipinyingshi48"></span>,
  },
  {
    title: "演出",
    url: "show",
    icon: <span className="iconfont icon-yanchu-xianxing2-0"></span>,
  },
  {
    title: "我的",
    url: "mine",
    icon: <span className="iconfont icon-wode"></span>,
  },
];

const Tarbar = () => {
  return (
    <ul className="tabbar">
      {list.map((item, index) => (
        <li key={index}>
          <NavLink to={"/home/" + item.url}>
            {item.icon}
            <p>{item.title}</p>
          </NavLink>
        </li>
      ))}
    </ul>
  );
};

export default Tarbar;
